<template>
  <div class="container">
    <el-row style="margin-top:6px">
      <el-col :span="2" style="text-align: left">
        <el-avatar
          shape="square"
          :size="medium"
          src="https://aedupro.oss-cn-beijing.aliyuncs.com/2022/04/30/92d61027d1ab465aa74eb94afed7bd6b%E8%89%BE%E6%96%AF.png"
        ></el-avatar>
      </el-col>
      <el-col :span="19" style="text-align: left">
        <el-input v-model="input" placeholder="请输入内容"></el-input>
      </el-col>
      <el-col :span="3" style="text-align: right">
        <el-button type="primary">发布</el-button>
      </el-col>
    </el-row>
    <el-row>
      <el-card class="box-card">
        <el-row>
          <el-col :span="3" class="comment">
            <span>2条评论</span>
          </el-col>
          <el-col :span="8" :offset="12" style="text-align:right">
            <el-radio-group v-model="radio" size="mini">
              <el-radio-button label="默认"></el-radio-button>
              <el-radio-button label="时间"></el-radio-button>
              <el-radio-button label="点赞"></el-radio-button>
            </el-radio-group>
          </el-col>
        </el-row>
        <el-divider class="splitline"></el-divider>
        <CommentInfo></CommentInfo>
        <el-row>
          <el-col :span="22" :offset="1">
             <CommentInfo></CommentInfo>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="21" :offset="2">
             <CommentInfo></CommentInfo>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20" :offset="3">
             <CommentInfo></CommentInfo>
          </el-col>
        </el-row>
        <CommentInfo></CommentInfo>
        <CommentInfo></CommentInfo>
      </el-card>
    </el-row>
  </div>
</template>

<script>
import CommentInfo from './CommentInfo.vue';
export default {
  data() {
    return {
      radio:'默认'
    };
  },
  components: { CommentInfo },
  methods: {},
};
</script>

<style scoped>
.comment {
  font-size: 15px;
  font-weight: 600;
  line-height: 30px;
}
.splitline {
  margin-top: 13px;
  margin-bottom: 10px;
}
</style>